<template>
	<view class="">
		<u-navbar backIconColor="#fff" titleColor="#fff" :title="name" :background="{ background: 'var(--mainColor)' }"></u-navbar>
		<mescroll-body ref="mescrollRef" :bottombar="false" @init="mescrollInit" @down="downCallback" @up="upCallback">
			<view class="">
				<view class="flex flex-column u-m-20">
				  <block v-for="(item,index) in goods" :key="index">
						<view class="flex u-p-20 u-m-b-20 bg-white rounded-10" @click="toDetail(item.id)">
							<u-image class="border" borderRadius="5" :src="item.image" width="180rpx" height="180rpx"></u-image>
							<view class="flex flex-column justify-between flex-1 u-p-x-20">
								<text class="u-font-28 text-ellipsis-2" style="line-height: 40rpx;">{{item.goods_name}}</text>
								<text class="u-p-y-10 u-font-30 font-weight-bold text-danger">¥{{item.goods_min_price}}</text>
								<view class="flex align-center">
									<view class="u-m-r-30" v-if="formData.merch_id==0">
										<u-tag text="自营" shape="circle" size="mini" ></u-tag>
									</view>
								  <text class="text-greey">已售{{item.goods_sales}}件</text>
								</view>
							</view>
						</view>
				  </block>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import { GoodsCenterApi } from '@/api/serves.js'
	export default {
		mixins: [MescrollMixin], // 使用mixin
		data() {
			return {
				name: '',
				formData: {//商品
				  id: -1,
          name:'',  
				  types: 'normal',
          is_merch: 0,
				  goods_min_price: 0,
				  goods_max_price: 0,
				},
				goods: []
			}
		},
		onLoad(options) {
			console.log('options', options);
			this.formData.id = options.id
			this.name = options.name
		},
		methods: {
			// 上拉加载
			upCallback(page) {
				console.log(this.formData);
				GoodsCenterApi.category_list({...this.formData, page: page.num}).then(res => {
				  console.log('商品数据', res);
				  if (res.code == 1) {
				    if(page.num == 1) this.goods = []
				    this.goods = this.goods.concat(res.data.listdata);
				    this.mescroll.endByPage(res.data.pagedata.data.length, res.data.pagedata.total); // 石佛欧有下一页
				  }else {
            this.$u.toast(res.msg)
          }
				}).catch(()=>{
					//联网失败, 结束加载
					this.mescroll.endErr();
				})
			},
			toDetail(goods_id) {
			  uni.navigateTo({
			    url:'/pages/goodsDetail/commonGoodsDetail/commonGoodsDetail?goods_id='+ goods_id
			  })
			}
		}
	}
</script>

<style lang="scss" scoped>

</style>
